<template>
	<view class="">
		<u-navbar titleStyle="font-size:40rpx;color:#333" :placeholder='true' title="收货地址" :autoBack="true">
			<view class="flex" slot="right">
				<view class="fontS32" style="margin-right:40rpx;" @click="showmanger=!showmanger"
					:class="showmanger?'homeRed':''">
					{{showmanger?'完成':'编辑'}}
				</view>
				<u-icon name="plus" color="#333" @click="$my.go('/pages/my/more/address/addAddress')"></u-icon>
			</view>
		</u-navbar>

		<!-- 没有收货地址 -->
		<view class="fixed center" style="top: 50%;left: 50%;transform: translateX(-50%) translateY(-50%);"
			v-if="list.length<=0">
			<image src="/static/images/mine/Group 33223.png" mode="" style="width: 356rpx;height: 226rpx;">
			</image>
			<text class="co9">您还没有添加收货地址</text>
		</view>
		<view>
			<u-checkbox-group v-model="checkboxValue1" placement="column" v-if="list.length>0">
				<view class="whiteBox flexJBC mt32 " style="padding: 20rpx 32rpx;" v-for="item in list" :key="item.id"
					@click="listClick(item)">
					<view>
						<view class="flex">
							<u-checkbox :customStyle="{marginBottom: '8px'}" :name="item.id" style='margin-right:24rpx;'
								v-if="showmanger" activeColor="#DD2131">
							</u-checkbox>
							<view class="fontS28">
								<view class="flex" style="align-items: flex-start;" >
									<view class="" :style="{maxWidth:item.is_default?'80%':'100%'}"> 
										{{item.take_company_name}}
									</view>
									<view class="homeRed moren fontS18"  v-if="item.is_default" style="white-space: nowrap;">
										默认
									</view>
								</view>
								<view class="flex " style="margin-top: 8rpx;">
									下单人：
									<view>
										{{item.real_name}}
									</view>
									<view class="co6" style="margin-left: 8rpx;">
										{{$my.hidephone(item.phone)}}
									</view> 
								</view>
								<view class="flex " style="margin-top: 8rpx;">
									提货人：
									<view>
										{{item.take_name}}
									</view>
									<view class="co6" style="margin-left: 8rpx;">
										{{$my.hidephone(item.take_phone)}}
									</view> 
								</view>
							</view>
						</view>
					</view>
					<u-icon name="arrow-right" color="#999" v-if="!showmanger" style='margin-left: 20rpx;'></u-icon>
					<u-icon name="edit-pen" color="#999" size="48rpx" v-else style='margin-left: 20rpx;'></u-icon>
				</view>
			</u-checkbox-group>
		</view>
		<!-- 底部按钮 -->
		<view class="bottomBox flexJBC paddingLR32 " v-if="showmanger">
			<u-checkbox-group v-model="isAll" placement="column" @change="checkboxChange">
				<u-checkbox :customStyle="{marginBottom: '8px'}" label="全选" name="all" style='margin-right:24rpx;'
					v-if="showmanger" activeColor="#DD2131">
				</u-checkbox>
			</u-checkbox-group>
			<view class="btnClick1 homeRed borderred" @click="$u.throttle(del,1000)">
				删除{{checkboxValue1.length>0?checkboxValue1.length:''}}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				type:null, //type 有值 表示是从购买页sureOrder过来   1是购物车购买  2是直接购买
				isAll: [], //是否全选
				showmanger: false,
				checkboxValue1: [], //多选的ids
				list: [],
			}
		},
		watch: {
			// 监听复选框
			checkboxValue1(newvalue, old) {
				if (newvalue.length < this.list.length) {
					this.isAll = []
				} else {
					this.isAll = ['all']
				}
			}
		},
		onLoad(option) {
			//判断是否从购买页过来
			this.type=option.type?option.type:null;
		},
		onShow() {
			this.getList()
		},
		methods: {
			listClick(item){
				let pages = getCurrentPages();
				let item1;
				if(this.type && !this.showmanger){
					pages.forEach((item2,index)=>{
						if(item2.route=='pages/my/order/sureOrder'){
							item1=item2
						}
					})
					if(this.type==1){
						// 购物车购买
						this.$my.go('/pages/my/order/sureOrder?type=1&cart_id='+item1.cart_id +'&address_id='+item.id+'&ticket='+(item1.options.ticket?item1.options.ticket:''))
					}else{
						//直接购买
						this.$my.go('/pages/my/order/sureOrder?type=2&orderinfo='+item1.options.orderinfo+'&address_id='+item.id+'&ticket='+(item1.options.ticket?item1.options.ticket:''))
					}
				}else{
					// 修改地址
					this.$my.go(`/pages/my/more/address/addAddress?id=${item.id}`)
					this.showmanger=false;
				}
			},
			getList() {
				this.$my.get('/index/user/get_address').then(res => {
					if (res.code == 200) {
						this.list = res.data
					}
				}) 
			},
			checkboxChange(e) {
				this.checkboxValue1 = [];
				this.list.forEach(item => {
					if (e.length > 0) {
						this.checkboxValue1.push(item.id)
					} else {
						this.checkboxValue1 = []
					}
				})
			},
			del() {
				let _this=this
				if (this.checkboxValue1.length > 0) {
					uni.showModal({
						title: "",
						content: "确定要删除吗",
						cancelText: '取消', // 取消按钮的文字   
						confirmText: '确认', // 确认按钮的文字   
						success: function(res) { 
							if (res.confirm) {
								uni.showLoading({
									title: '删除中'
								})
								_this.$my.post('/index/user/del_address', {
									id: _this.checkboxValue1
								}).then(res => {
									uni.hideLoading()
									_this.$my.toast(res.message)
									if (res.code == 200) {
										_this.getList()
										_this.checkboxValue1 = []
									}
								})
							}
						}
					})

				} else {
					this.$my.toast('请先选择要删除的列表')
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	
	page {
		padding-bottom: 140rpx;
	}

	.bottomBox {
		width: 100%;
		height: 112rpx;
		background-color: #fff;
		position: fixed;
		bottom: 0;
	}

	.moren {
		border: 1rpx solid $red;
		border-radius: 8rpx;
		padding: 0 8rpx;
		text-align: center;
		margin-left: 16rpx;
	}
</style>
